<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>sample tag</title>
	<link rel="stylesheet" type="text/css" href="css/jquery.tagsinput.css" />
<script src="js/jquery.js" type="text/javascript" language="javascript"></script>
<script src="js/jquery.tagsinput.js" type="text/javascript" language="javascript"></script>
<script language="javascript" type="text/javascript" src="js/ajaxQuickInsert.js"></script>
<script  type="text/javascript" language="javascript">
var tagTemp='';
var tagRemoveTemp='';
var oldTagList='';
$(document).ready(pageLoaded);
function pageLoaded()
{	
	updateOldTagList();
} 
$(function() {
		
				$('#tags').tagsInput({
				
				interactive: true,
				height: '60px',
				delimiter: ';',
				'removeWithBackspace' : false,
				'onAddTag':addTag,
				'onRemoveTag':removeTag
			});
		});
	function addTag()
	{
	//	var oldTagList=$('#tags').val().substring(0,$('#tags').val().indexOf(tagTemp)-1);;
		ajaxSendTagItem('tableTag','1','Tag','add',tagTemp, oldTagList);
	}
	function removeTag()
	{
		
	//	var oldTagList=$('#tags').val()+';'+tagRemoveTemp;
	//	alert(oldTagList);
		ajaxSendTagItem('tableTag','1','Tag','remove',tagRemoveTemp,oldTagList);
	}
	function updateOldTagList()
	{
		oldTagList=$('#tags').val();
	}
</script>
	
</head>
<body>
<form action="">
	
	<input name="tags" id="tags"  />
</form>
</body>
</html>
